<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="_fragments :: head(~{::title})">
  <title>Kuang_lib-照片墙</title>
</head>
<body>

<!--导航-->
<nav th:replace="_fragments :: topbar(6)"></nav>

<!--顶部图片-->
<div class="m-bg-type_outer" style="width: 100%;height: 40%">
    <div class="m-bg-class_cover">
        <div align="center">
            <div class="ui container" align="center" style="position: relative ;bottom: -585px;" >
                <div class="m-font-size-text-init-title m-margin-top" align="center">要么读书要么旅行，灵魂和身体，必须有一个在路上。</div>
            </div>
        </div>
    </div>
</div>
<!--照片墙-->
<div id="picture-main">

    <article class="thumb" th:each="picture : ${pictures}">
        <div class="ma5-gallery">
            <div class="rthumbnail">
                <a th:href="@{${picture.pictureaddress}}">
                    <img class="picture-zmki_px" th:src="@{${picture.pictureaddress}}">
                </a>
                <div class="m-picture-text" th:text="${picture.picturename}">起风了</div>
                <div  class="rcaption">
                    <div style="font-size: large;" th:text="${picture.picturename}">起风了</div>
                    <div style="font-size: 16px" class="m-margin-top" th:text="${picture.picturetime}">2020-02-02 &nbsp;深圳</div>
                    <p style="font-size: 16px" th:text="${picture.picturedescription}">我曾难自拔于世界之大，也沉迷于其中梦话</p>
                </div>
            </div>
        </div>
    </article>

</div>



<!--置顶图标-->
<div id="toolbar" class="m-padded-tb-large m-fixed m-right-bottom">
    <a href="#" class="ui teal icon button"><i class="chevron up icon"></i> </a>
</div>

<!--底部栏-->
<footer th:replace="_fragments :: footer"></footer>

<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.js"></script>
<script th:src="@{/lib/picture/js/jquery.min.js}"></script>
<script th:src="@{/lib/picture/js/jkresponsivegallery.js}"></script>

<script th:replace="_fragments :: scriptTimer"></script>
<!--<script>-->

<!--    $(function() {-->
<!--        $('.rthumbnail').responsivegallery();-->
<!--    });-->

<!--  </script>-->
</body>
</html>